<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>手机震动</title>
</head>
<body>
    <button type="button" onclick="f1()" class="btn1" style="display: none;">震动测试</button>
    <script>
    //Vibration接口用于在web浏览器中发出指令，让移动端设备振动。其中要判断是否支持此方法
            function vibration() {
                navigator.vibrate = navigator.vibrate || navigator.webkitVibrate || navigator.mozVibrate || navigator.msVibrate;
                if (navigator.vibrate) {
                    return true;
                    
                }else{
                    return false;
                    
                }
            }

            //[震动时间，停止时间，震动时间，停止时间…] 
            //[200,100,200, 200,100, 200.........]
            if (vibration()==true){
                document.querySelector(".btn1").style.display='block';
                alert("设备支持震动测试")
                //navigator.vibrate([200,100,200,100,200]);
            }else{
                alert("设备不支持震动测试")
            }

            function f1(){
                navigator.vibrate([200,100,200,100,200]);
                console.log("震动已完成！")
            }
    </script>
    
        
</body>
</html>
